<template>
  <div>
    <h1>百度地图</h1>
    <a-button type="primary" @click="openMapModal">
      打开百度地图
    </a-button>
    
    <!-- 百度地图弹窗组件 -->
    <MapModal v-model:open="mapModalVisible" />
  </div>
</template>

<script lang="ts" setup>
import { ref } from 'vue'
import MapModal from './MapModal.vue'

const mapModalVisible = ref(false)

const openMapModal = () => {
  mapModalVisible.value = true
}
</script>

<style lang="scss">
#my_baidu_map {
  width: 100%;
  height: 100%;
}
</style>
